<template>
  <view class="mytotal">
    <view class="checkall">
      <radio @click="changAll" :checked="isCheck" color="#ff0000" />全选
    </view>
    <view class="total">
      合计：<text>￥{{totalPrice}}</text>
    </view>
    <view class="btn">
      <button @click="pay" size="mini">结算（{{changeInfo}}）</button>
    </view>
  </view>
</template>

<script>
import {mapGetters,mapMutations,mapState} from 'vuex'
  export default {
    computed:{
      ...mapGetters('cart',['changeInfo','isCheck','totalPrice']),
      ...mapState('user',['address','token'])
    },
    name:"my-total",
    methods:{
      ...mapMutations('cart',['changeAllStatus']),
      ...mapMutations('user',['setRedirectInfo']),
      changAll(){
        this.changeAllStatus(!this.changeInfo)
      },
      pay(){
        if (this.changeInfo <= 0) return uni.$showMsg('必须要选中商品')
        if(!this.address.userName) return uni.$showMsg('收货地址不能为空')
        // if(!this.token) return uni.$showMsg('请先登录')
        if(!this.token){
          this.payGoods()
        }
      },
      payGoods(){
        this.seconds = 3
        this.showTips(this.seconds)
       this.tiemout= setInterval(()=>{
         this.seconds--
         if(this.seconds <= 0) {
           clearInterval(this.tiemout)
           return uni.switchTab({
             url:'/pages/my/my',
             complete:()=> {
               this.setRedirectInfo({
                 opentype:'switchTab',
                 from:'/pages/cart/cart'
               })
             }
           })
         }
        this.showTips(this.seconds)
        },1000)
      },
      showTips(time){
        uni.showToast({
          title:`您还没有登录! ${time}秒后跳转到登录页面`,
          icon:'none',
          duration: 1500
        })
      }
    },
    data() {
      return {
        tiemout:null,
        seconds:3
      };
    }
  }
</script>

<style lang="scss">
.mytotal {
  background-color: #eee;
  z-index: 999;
  height: 80px;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  box-sizing: border-box;
  position: fixed;
  bottom: 0px;
  left: 0px;
  .checkall {}
  .total {
    text {
      color: #c00000;
    }
  }
  .btn {
    button {
      height: 40px;
      line-height: 40px;
      background-color: #c00000;
      color: #fff;
      border-radius: 0;
      font-size: 14px;
    }
  }
}
</style>